<html>

<head>
	<title>Test Browser proof of concept</title>

	<link rel="stylesheet" type="text/css" href="base.css" >
	<link rel="stylesheet" type="text/css" href="viewer.css" >
	

	<!-- Base JS -->
	<script type="text/javascript" src="lib/jquery/jquery-1.4.1.min.js"></script>
	<script type="text/javascript" src="lib/jquery.shortkeys/jquery.shortkeys.js"></script>
	<script type="text/javascript" src="lib/jquery.scrollTo-1.4.2/jquery.scrollTo-min.js"></script>
	<script type="text/javascript" src="lib/jquery.syntaxHighlighter-2.1.364/scripts/shCore.js"></script>
	<script type="text/javascript" src="lib/jquery.syntaxHighlighter-2.1.364/scripts/shBrushJScript.js"></script>
	<script type="text/javascript" src="lib/jquery.syntaxHighlighter-2.1.364/scripts/shBrushCss.js"></script>
	<script type="text/javascript" src="lib/jquery.syntaxHighlighter-2.1.364/scripts/shBrushXml.js"></script>
	
	<!-- Provide .offset.left & .offset.right properties -->
	<!--<script type="text/javascript" src="jquery.dimensions-1.2/jquery.shortkeys.min.js"></script>-->


	<!-- Plug-in CSS -->
	<link href="lib/jquery.syntaxHighlighter-2.1.364/styles/shCore.css" rel="stylesheet" type="text/css" />
	<link href="lib/jquery.syntaxHighlighter-2.1.364/styles/shThemeDefault.css" rel="stylesheet" type="text/css" />
	
	<script type="text/javascript" src="viewer.js" ></script>
	
	<script type="text/javascript">
		$(document).ready( function(){
			
			// Grab the intended course / week / presentation name.
			//	Should be in the form of .../viewer.htm?path=YearTerm_Course_FolderWeek#optionalbookmark
			var sName = window.location.href;
			
			// See if we're loading the sample in the current directory, or content in another folder.
			if( sName.indexOf("?") != -1 ) {
				sName = sName.substring(
							sName.lastIndexOf("viewer.htm?")+11,
							sName.lastIndexOf('#') == -1 ? sName.length : sName.lastIndexOf('#'));
				sName = sName.replace( /\_/g, "/") + "/show.txt";
			} else {
				sName = "show.txt"
			}
			// Enable Easing mod to enhance the scroll effect
			fixEasing();
			
			// Note that all calls are blocking/synchronous.
			//	SyntaxHighlighter doesn't work if it isn't 
			//		run in the page .ready() function.
				
			// Get content  
			$.ajax({
				type: 'GET',
				async: false,
				url: sName,
				dataType: 'html',
				success: function(data){
						$('#viewContent').html(ConvertTags(data));
					},
				error: function(XMLHttpRequest, textStatus, errorThrown){
						alert("Error:\n\n" + textStatus + "\n\n" + errorThrown);
					}
				});
				
			// Get title info
			$.ajax({
				type: 'GET',
				async: false,
				url: 'title.txt',
				dataType: 'html',
				success: function(data){
						$('#viewTitle').html("<h1>"+sName.replace(/\_/g, " -> ")+"</h1>"+data);
					}
				});
			
			// Create table of contents
			$('#viewToc').html(buildToc($('#viewContent')));

			// Apply the classes to setup the scrollable lists.
			buildNavList($('#viewContent'));
			
			// Enable navigation (needs to be done after all content's been added to page)
			enableShortKeys();
			
			// enable control box
			enableViewControls( $('#viewControls'));
			
			// Hide notes
			$('i').toggle();
			
			// Pull out all notes into a parse array.
			var aNotes = parseComments( $('#viewContent') );
			
			// Highlight (note that this isn't blocking; instead attaches event to window load event)
			SyntaxHighlighter.config.clipboardSwf = 'jquery.syntaxHighlighter-2.1.364/scripts/clipboard.swf';
			SyntaxHighlighter.defaults['gutter'] = false;
			SyntaxHighlighter.all(); 
			
			/**
			 * Adds event handler to the target object.
			 * @param {Object} obj		Target object.
			 * @param {String} type		Name of the event.
			 * @param {Function} func	Handling function.
			 */
			var addEvent = function(obj, type, func)
			{
				if (obj.attachEvent) 
				{
					obj['e' + type + func] = func;
					obj[type + func] = function()
					{
						obj['e' + type + func](window.event);
					}
					obj.attachEvent('on' + type, obj[type + func]);
				}
				else 
				{
					obj.addEventListener(type, func, false);
				}
			};
			
			// Setup comments.  Needs to happen after code has been setup, or divs will be translated 
			addEvent( window,'load', function() { showComments( aNotes, $('#viewContent') ); } );
			
		});
	</script>

</head>

<body class=" yui-skin-sam">

<div id="hd" class="hd">
	<div id="viewTitle">
		Sample Title
	</div>

<div id="viewToc">
	<b>Table of Contents</b>
	Sample TOC
</div>


<div id="viewContent">
	<b>Content</b>
	Sample Content
</div>

<div id="viewControls">
	<span id="viewControl_Plus">+</span>
	<span id="viewControl_Minus">-</span>
</div>

<div id="viewComment"></div>

<!-- Div box for extra <br/> space at end of docu -->
<div id="viewEnd" style="height:1000px;"></div>

<p>Code and Content Copyright Nathan Garrett (c) 2010</p>

</body>
</html>